<template>

  <div class="popupMask">
    <div class="popupPenal">
      <div class="popPenalTitle">
        <div class="popPenalTitleName">
          {{newOrEdit}}组织
        </div>
        <div class="popupClose ensure">

          <el-button type="primary" size="mini" @click="addLaboratory('ruleForm')">保存</el-button>
        </div>
        <div class="popupClose">
          <el-button size="mini" v-on:click="resetForm('ruleForm')">关闭</el-button>
        </div>
      </div>
      <div class="penalContent" style="padding:30px;">
        <el-form label-width="110px" :model="ruleForm" :rules="rules" ref="ruleForm" class="demo-ruleForm">

          <el-form-item label="名称" prop="name">
            <el-col :span="22">
              <el-input placeholder="名称" v-model='ruleForm.name'></el-input>
            </el-col>
          </el-form-item>
          <el-form-item label="简称" prop="ename">
            <el-col :span="22">
              <el-input placeholder="简称" v-model='ruleForm.ename'></el-input>
            </el-col>
          </el-form-item>
          <el-form-item label="排序" prop="sort">
            <el-col :span="22">
              <el-input oninput="this.value=this.value.replace(/[^0-9]+/,'');" placeholder="排序" v-model='ruleForm.sort'></el-input>
            </el-col>
          </el-form-item>
        </el-form>

      </div>
      <div class="penalFooter" v-if="newOrEdit == 'edit'">
        <p><span>创建人 : </span><span>{{ruleForm.createBy}}</span></p>
        <p><span>创建时间 :</span><span>{{ruleForm.createTime}}</span></p>

        <p v-if="ruleForm.updateBy != undefined "><span>修改人 : </span><span>{{ruleForm.updateBy}}</span></p>
        <p v-if="ruleForm.updateTime != undefined"><span>修改时间 : </span><span>{{ruleForm.updateTime}}</span></p>
      </div>
    </div>
  </div>
</template>

<script>
	import $ from 'jquery'
  
  export default {
    data() {
      return {
        newOrEdit: this.$parent.addGroupText,
        groupData:this.$parent.groupData,
        ruleForm: {
          code: '',
          name: '',
          ename:"",
          sort:"",
        },

        rules: { //表单验证的规则
          name: [{
            type: 'string',
            required: true,
            message: '请填写名称',
            trigger: 'blur'
          }, ],
          ename: [{
            type: 'string',
            required: true,
            message: '请填写名称',
            trigger: 'blur'
          }, ],
      },
    };
  },
    mounted() {
      if(this.$parent.addGroupText == '编辑'){
        this.ruleForm = JSON.parse(JSON.stringify(this.groupData))
      }else{
        this.ruleForm = {
          code: '',
          name: '',
          ename:"",
          sort:"",
        }
      }

    },
    methods: {


      addLaboratory(formName) {
        this.$refs[formName].validate((valid) => { //表单验证
          if (valid) {
            if (this.$parent.addGroupText == "新增") {
              var url = '/systemmanage/addGroup.htm';
              var data = {
                code: this.ruleForm.code,
                name: this.ruleForm.name,
                parent: this.groupData.code, //group为父节点的code、
                parentName:this.groupData.ename,
                ename: this.ruleForm.ename,
                sort:this.ruleForm.sort,
              };
            } else {
              var url = '/systemmanage/updateGroup.htm';
              var data = {
                id: this.ruleForm.id,
                code: this.ruleForm.code,
                name: this.ruleForm.name,
                parent: this.groupData.code,
               parentName:this.groupData.ename,
                ename: this.ruleForm.ename,
                sort:this.ruleForm.sort,
              }

            }
            this.$http({
              method: 'post',
              apiUrl: url,
              params: data,
              isJson: false,
            }).then(res => {
              if (res.code == 0) {
                this.$message({
                  type: 'success',
                  message: '提交成功!'
                });
                this.$parent.groupData = {};
                this.$parent.getData();
                this.resetForm('ruleForm')
              }

            })
          } else {
            return false;
          }
        });

      },

      resetForm(formName) { //重置表单,关闭表单

        this.$refs[formName].resetFields(); //重置表单
        this.ruleForm = {


          },
          this.$parent.groupShow = false; //关闭表单

      },

    }
  }
  $(function() {
    $(".group .el-input input").unbind('click')
  })
</script>

<style scoped>
  .group .el-input.is-disabled .el-input__suffix {
    display: none !important;
  }

  .el-form .el-form-item {
    display: inline-block;
    width: 50%;
    float: left;
  }
</style>
